<template>
	<div class="executive-detail">
		<h3>企业高管详细信息</h3>
		<el-form :model="form">
			<div class="clearfix">
				<el-form-item label="高管编号" :label-width="formLabelWidth" style="width: 500px; float: left">
					<el-input v-model="form.executiveId" autocomplete="off" style="width: 420px" readonly></el-input>
				</el-form-item>
				<el-form-item label="高管名称" :label-width="formLabelWidth"
					style="width: 500px; float: left; margin-left: 50px">
					<el-input v-model="form.executiveName" autocomplete="off" style="width: 420px" readonly></el-input>
				</el-form-item>
			</div>
			<div class="clearfix">
				<el-form-item label="职务" :label-width="formLabelWidth" style="width: 500px; float: left">
					<el-input v-model="form.postName" autocomplete="off" style="width: 420px" readonly></el-input>
				</el-form-item>
				<el-form-item label="性别" :label-width="formLabelWidth"
					style="width: 500px; float: left; margin-left: 50px">
					<el-input v-model="form.sexName" autocomplete="off" style="width: 420px" readonly></el-input>
				</el-form-item>
			</div>
			<div class="clearfix">
				<el-form-item label="出生日期" :label-width="formLabelWidth" style="width: 500px; float: left">
					<el-input v-model="form.birthday" autocomplete="off" style="width: 420px" readonly></el-input>
				</el-form-item>
				<el-form-item label="学历" :label-width="formLabelWidth"
					style="width: 500px; float: left; margin-left: 50px">
					<el-input v-model="form.educationName" autocomplete="off" style="width: 420px" readonly></el-input>
				</el-form-item>
			</div>
			<div class="clearfix">
				<el-form-item label="登记日期" :label-width="formLabelWidth" style="width: 500px; float: left">
					<el-input v-model="form.registeredTime" autocomplete="off" style="width: 420px" readonly></el-input>
				</el-form-item>
				<el-form-item label="更新日期" :label-width="formLabelWidth"
					style="width: 500px; float: left; margin-left: 50px">
					<el-input v-model="form.updateTime" autocomplete="off" style="width: 420px" readonly></el-input>
				</el-form-item>
			</div>
		</el-form>
	</div>
</template>

<script>
	import { Executive } from '@/api/';
	export default {
		// 获取参数id,记录在props属性中;
		props: ['id'],
		data() {
			return {
				form: {},
				formLabelWidth: '120px'
			};
		},
		created() {
			// 加载企业高管信息列表;
			this.loadAllList(this.id);
		},
		methods: {
			// 获取企业高管信息列表;
			async loadAllList(id) {
				let {
					status,
					data
				} = await Executive.detail({ id });
				if (status) {
					this.form = data;
				}
			},
		},
	}
</script>

<style lang="less" scoped>
	.executive-detail {
		width: 1200px;
		margin: 50px auto 0;
		h3 {
			text-align: center;
		}
		.clearfix::after {
			content: '';
			display: block;
			clear: both;
		}
	}
</style>
